<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/common/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<head>
	<title>Login</title>
		<meta charset="utf-8">
		<link href="${ctx}/static/back/denglu/css/style.css" rel='stylesheet' type='text/css' />
		<link rel="stylesheet" href="${ctx}/static/lib/layui/css/layui.css">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
		<script src="${ctx}/static/commom/mylayer.js"></script>
        <script src="${ctx}/static/lib/layui/layui.js"></script>
        <script src="${ctx}/static/back/js/jquery.js"></script>
        <script>
		//一般直接写在一个js文件中
		layui.use(['layer'], function(){
		  var layer = layui.layer;
		  //layer.msg('Hello World');
		});
        </script>
		<script type="text/javascript">
		function submitForm(){
			/*
			1.验证用户名
			2.验证密码
			3.ajax提交后，根据后台ServerResponse决定进行什么操作
			*/
    		var username = $("#username").val();
    		var password = $("#password").val();

			//1.用户名不能为空
    		if(username == '' || username == undefined || username == null) {
    			mylayer.errorMsg("用户名不能为空");
    			return;
    		}
    		// 1.2、是否合法：4-8位数字或字母
    		var pattern = /^[0-9a-zA-Z]{3,8}$/;
    		if(!pattern.test(username)) {
    			mylayer.errorMsg("格式非法，请输入3-8位数字或字母");
    			return;
    		}
    		//2、密码不能为空
    		if(password == '' || password == undefined || password == null) {
    			mylayer.errorMsg("密码不能为空");
    			return;
    		}
    		
    		//3、ajax提交用户名和密码，根据后台返回的ServerResponse决定进行什么操作
    		 $.ajax({
    			url:"${ctx}/user/login.action",
    			type:"post",
    			dataType:"json",
    			data:$("#login_form").serialize(),
    			success:function(resp) {
    				console.log(resp);
    				if(resp.code == 0){
    					mylayer.successUrl(resp.msg, "${ctx}/index.action");
    				} else {
    					mylayer.errorMsg(resp.msg);
    				}
    			}
    		});
    	} 
    	/* $.ajax({
    		url : "${ctx}/user/login.action",
    		type : "post",
    		dataType : "json",
    		data : $("#login_form").serialize(),
    		success : function(resp){
    			if(resp.code == 0){
    				mylayer.successUrl(resp.msg, "${ctx}/index/list.action");
    			}else{
    				mylayer.errorMsg(resp.msg);
    			}
    		}
    	}); */

		</script>
</head>
<body>
	 <!-----start-main---->
	 <div class="main">
		<div class="login-form">
			<h1>后台管理登陆</h1>
					<div class="head">
						<img src="images/user.png" alt=""/>
					</div>
				<form id="login_form">
						<input type="text" id="username" name="name" class="text" value="USERNAME" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'USERNAME';}" >
						<input type="password" id="password" name="password" value="Password" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Password';}">
						<div class="submit">
							<input type="button" onclick="submitForm()" value="LOGIN">
					</div>	
					<p><a href="#">忘记密码？</a></p>
					<p><a href="${ctx}/user/getaddpage.action">注册</a></p>
				</form>
			</div>
			<!--//End-login-form-->
		</div> 
			 <!-----//end-main---->
		 		
<div style="display:none">
<script src='http://v7.cnzz.com/stat.php?id=155540&web_id=155540' language='JavaScript' charset='gb2312'></script></div>
</body>
</html>